import React, { PureComponent } from "react";
import { connect } from "dva";
import { Modal, Row, Col, Form, Icon, Select } from "antd";

const FormItem = Form.Item;
const { Option } = Select;


@connect(({ global }) => ({
  selectSource:global.selectSource,
}))
@Form.create()
export default class WhiteListAdd extends PureComponent {
  constructor(props) {
    super(props);
  }

  componentDidMount() {
    const { dispatch} = this.props;
    // 维保单位列表
    dispatch({
      type: 'global/fetch_select_maintencompany',
    });
  }


  handleSubmit(e) {
    e.preventDefault();
    this.props.form.validateFieldsAndScroll((err, values) => {
      if (!err && values) {
        this.props.callback(values);
      }
    });
  }

  handleReset = () => {
    this.props.form.resetFields();
  };

  handleCancel = () => {
    this.handleReset();
    this.props.onCancel(false);
  };




  render() {
    const { visible, selectSource } = this.props;
    const { getFieldDecorator } = this.props.form;


    const formItemLayout = {
      labelCol: { span: 4 },
      wrapperCol: { span: 20 }
    };

    return (
      <div>
        <Modal
          title={"将点位移动到"}
          okText={"确认"}
          visible={visible}
          onOk={this.handleSubmit.bind(this)}
          // confirmLoading={loading.submitting}
          onCancel={this.handleCancel}
        >
          <Form layout="horizontal">
            <Row gutter={24}>
              <Col span={24}>
                <FormItem {...formItemLayout} label="移动到" colon={false}>
                  {getFieldDecorator("maintenanceId", {
                    rules: [
                      {
                        required: true,
                        message: "请选择需要移动的维保单位"
                      }
                    ]
                  })(
                    <Select placeholder="请选择需要移动的维保单位" >
                      {selectSource.maintenance && selectSource.maintenance.map(item => (
                        <Option key={item.maintenanceId} value={item.maintenanceId}>{item.maintenanceName}</Option>
                      ))}
                    </Select>
                  )}
                </FormItem>
              </Col>
            </Row>
          </Form>
        </Modal>
      </div>
    );
  }
}
